<template>
  <div class="diaryReportContainer">
    <el-card>
      <div slot="header" class="clearfix" style="display: flex;align-items: center;justify-content: space-between">
        <span style="font-size: 18px;font-weight: bold;flex: 1">举报审核</span>
        <div class="block">
          <el-button type="success" icon="el-icon-search" size="mini" style="margin-right: 20px" @click="search">搜索</el-button>
          <span style="font-size: 14px;color: #1e1e1e;font-weight: bold;margin-right: 10px">状态</span>
          <el-select v-model="optionsValue" placeholder="请选择" style="margin-right: 40px" @change="optionChange">
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
          <span class="demonstration" style="font-size: 14px;color: #1e1e1e;font-weight: bold;margin-right: 10px"
          >默认</span>
          <el-date-picker
            v-model="value1"
            type="datetimerange"
            range-separator="至"
            @change="pickerChange"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          >
          </el-date-picker>
        </div>
      </div>
      <el-table
        :data="reportData"
        :header-cell-style="{textAlign: 'center',backgroundColor:'##ECEFF0',fontSize:'16px',fontWeight:'bold',color:'#101010'}"
        :cell-style="{ textAlign: 'center' }"
        style="width: 100%;margin-top: 20px"
      >
        <el-table-column
          prop="id"
          label="审核ID"
        >
        </el-table-column>
        <el-table-column
          prop="reportUser.nickName"
          label="举报人"
        >
        </el-table-column>
        <el-table-column
          prop="sourceUser.nickName"
          label="发布账号"
        >
        </el-table-column>
        <el-table-column
          prop="linkType"
          label="类型"
        >
          <template slot-scope="scope">
            <span v-if="scope.row.linkType==='1'">日记</span>
            <span v-else-if="scope.row.linkType==='2'">评论</span>
            <span v-else>评论回复</span>

          </template>
        </el-table-column>
        <el-table-column
          prop="linkDesc"
          show-overflow-tooltip
          label="文字内容"
        >
        </el-table-column>
        <el-table-column
          prop="isImages"
          label="含有图片"
          :formatter="formatImg"
        >
        </el-table-column>
        <el-table-column
          prop="createTime"
          label="发布时间"
        >
        </el-table-column>
        <el-table-column
          prop="reportFlag"
          label="状态"
        >
        </el-table-column>
        <el-table-column
          label="操作"
        >
          <template slot-scope="scope">
            <el-button type="text" style="color: red" @click="delReport(scope.row)">删除</el-button>
            <el-button type="text" style="color: #178FFE" @click="toDetail(scope.row)">详情</el-button>
            <el-button type="text" style="color: #6BB303" @click="checkReport(scope.row)">驳回</el-button>
          </template>
        </el-table-column>
      </el-table>
<!--      分页-->
      <pagination
        v-show="total>0"
        :total="total"
        :page.sync="queryParams.pageNum"
        :limit.sync="queryParams.pageSize"
        @pagination="getList"
      />
    </el-card>
  </div>
</template>
<script>
import { listCompassDiaryReport } from '@/api/system/CompassDiaryReport'
import { checkReport, deleteReport } from '../../../../api/system/CompassDiaryReport'

export default {
  data() {
    return {
      //选择时间，
      beginDate: '',
      endDate: '',
      //总页数
      total:0,
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        startTime:"",
        endTime:"",
        reportFlag:""
      },
      optionsValue: '全部',
      change: [],
      value1: '',
      options: [
        {
          value: '全部'
        },
        {
          value: '待处理'
        },
        {
          value: '已删除'
        },
        {
          value: '已驳回'
        }
      ],
      reportData: [],
    }
  },
  created() {
    this.getList()
  },
  methods: {
    //组装查询参数
    getQueryParams() {
      if (this.value1!=null&&this.value1.length>0){
        //给查询条件开始时间赋值
        this.queryParams.startTime=this.value1[0]
        //给查询条件结束时间赋值
        this.queryParams.endTime=this.value1[1]
      }else{
        //给查询条件开始时间赋值
        this.queryParams.startTime=""
        //给查询条件结束时间赋值
        this.queryParams.endTime=""
      }
      //给查询条件状态赋值
      this.queryParams.reportFlag=this.optionsValue
      if(this.queryParams.reportFlag==="全部"){
        //当查询条件为全部的时候，查询状态赋值为空
        this.queryParams.reportFlag=""
      }
    },
    pickerChange() {
     this.getQueryParams()
      listCompassDiaryReport(this.queryParams).then(res => {
        //将返回结果数据给表格集合
        this.reportData = res.rows
        //将返回结果总页数赋值给分页总页数变量
        this.total=res.total
        //默认分页数据第一页
        this.queryParams.pageNum=1
      })
    },
    //搜索按钮
    search(){
      this.getQueryParams()
      listCompassDiaryReport(this.queryParams).then(res => {
        //将返回结果数据给表格集合
        this.reportData = res.rows
        //将返回结果总页数赋值给分页总页数变量
        this.total=res.total
      })
    },
    //下拉菜单改变
    optionChange() {
      this.getQueryParams()
      listCompassDiaryReport(this.queryParams).then(res => {
        //将返回结果数据给表格集合
        this.reportData = res.rows
        //将返回结果总页数赋值给分页总页数变量
        this.total=res.total
      })
    },
    //判断图片内容
    formatImg: function(row, column, cellValue) {
      if (cellValue === 1) {
        return '是'
      } else if (cellValue === 0) {
        return '否'
      }
    },
    //获取举报信息
    getList() {
      this.getQueryParams()
      listCompassDiaryReport(this.queryParams).then(res => {
        this.reportData = res.rows
        this.total=res.total
      }).catch(err => {
      })
    },
    toDetail(row) {
      this.$router.push({
        name: 'auditReport',
        query: {
          id: row.id
        }
      })
    },
    //  删除数据
    delReport(row) {
      const ids = row.id || this.ids
      this.$confirm('是否确认删除家长圈日记管理编号为"' + ids + '"的数据项?', '警告', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(function() {
        return checkReport(ids,2)
      }).then(() => {
        this.getList()
        this.msgSuccess('删除成功')
      }).catch(function() {
      })
    },
    //  驳回功能
    checkReport(row) {
      const ids = row.id
      const type=1
      this.$confirm('是否确定要驳回编号为"' + ids + '"的数据项?', '警告', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(function() {
        return checkReport(ids, type)
      }).then((res) => {
        this.reportData = res.rows
        this.msgSuccess('驳回成功')
      }).catch(function() {
      })
    }
  }
}
</script>
<style lang="scss" scoped>

</style>
